<template>
  <div class="radio">
      <el-radio-group v-model="checkPollute" @change="handleCheckedChange">
          <el-radio  v-for="(item,index) in dataGrid" :label="item"
            :key="index">{{ item.pollutename }}</el-radio>
      </el-radio-group>
  </div>
</template>

<script>
export default {
  props: {
    checkedKeys: Array, // 默认选中
    dataGrid: {
      type: Array,
      default: () => []
    }
  },
  watch: {
    checkPollute(n) {
      this.$emit('change', n);
    },
    checkedKeysAndDataGrid(n) {
      const { checkedKeys, dataGrid } = n;
      if (checkedKeys.length && dataGrid.length) {
        const pollutecode = this.checkedKeys[0];
        this.checkPollute = this.dataGrid.find(v => v.pollutecode === pollutecode);
      }
    }
  },
  computed: {
    checkedKeysAndDataGrid() {
      const { checkedKeys, dataGrid } = this;
      return {
        checkedKeys, dataGrid
      };
    }
  },
  data() {
    return {
      checkPollute: ''
    };
  },
  methods: {
    handleCheckedChange(val) {
      // console.log(val);
    }
  }
};
</script>

<style lang="scss" scoped>
.radio{
  /deep/ .el-radio{
    margin-bottom: 5px;
    margin-left: 5px;
    margin-top: 5px;
  }
  .numerical {
    float: right;
    color: #909399;
  }
}
</style>